<template>
    <div class="card-box">
        <el-card class="box-card">
            <div class="head-title">
                <div class="title">
                    <span>平台信息</span>
                </div>
            </div>
            <div class="plate-img">
                <img :src="plateinfo.img" alt="">
            </div>
            <div class="plate-info">
                <div class="plt-name">
                    <span class="name" v-html="plateinfo.name"></span><el-tag>{{ plateinfo.tag }}</el-tag>
                </div>
                <div class="plt-detail">
                    <div>
                        <div>
                            <i class='bx bxs-edit-location'></i><a>{{ plateinfo.address }}</a>
                        </div>
                        <div>
                            <i class='bx bx-envelope'></i><a>{{ plateinfo.email }}</a>
                        </div>
                        <div>
                            <i class='bx bxs-phone'></i><a>{{ plateinfo.phone }}</a>
                        </div>
                    </div>
                </div>
            </div>
            <el-row>
            </el-row>
            <el-row gutter="24">
                <br>
                <br>
                <p style="text-align: left;">&nbsp;&nbsp;&nbsp;利率</p>
                <el-col span="14">
                    <el-input></el-input>
                </el-col>
                <el-col span="10">
                    <el-button class="edit-btn" type="primary">修改</el-button>
                </el-col>
            </el-row>
        </el-card>
    </div>
</template>
<style scoped>
.card-box {
    position: relative;
    float: left;
    display: inline;
    width: 35vh;
    /* height: 85vh; */
}





.head-title {
    display: flex;
    justify-content: space-between;
}

.head-title .action a {
    color: #0080ff;
    text-decoration: none;
    line-height: 22px;
    cursor: pointer;
    -webkit-transition: all .3s;
    transition: all .3s;
}

.plt-detail {
    text-align: left;
    position: relative;
    color: #464646;
    display: block;
    float: left;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
}

.plt-name {
    width: 100%;
    display: flex;
    margin-top: 15px;
    justify-content: center;
    align-items: center;
}

.plt-name .name {
    font-size: 18px;
    font-weight: 600;
    margin-right: 10px;
    text-align: left;
}

.plt-detail div {
    margin-bottom: 10px;
}

.plt-detail a {
    font-weight: 400;
}

.plt-detail i {
    font-size: 18px;
    margin-right: 10px;
    font-weight: 400;
}

.plate-img {
    margin-top: 20px;
    border-radius: 5px;
    overflow: hidden;
    background-color: #0080ff;
    height: 170px;
}

.plate-img img {
    width: 100%;
    height: auto;
}
</style>
<script>
export default {
    props: {
        plateinfo: {
            img: {
                type: String,
                default: 'img/mine/def_img.jpg'
            },
            tag: {
                type: String,
                default: '去认证'
            },
            name: {
                type: String,
                default: '平台名称'
            },
            address: {
                type: String,
                default: '平台地址'
            },
            email: {
                type: String,
                default: '平台电子邮箱'
            },
            phone: {
                type: String,
                default: '平台联系电话'
            },
            scale: {
                type: String,
                default: '平台规模'
            },
            industry: {
                type: String,
                default: '平台所属行业'
            }
        }
    }
}
</script>